import React from 'react';
import ReactDOM from 'react-dom';
import ComponentBodyChild from './bodychild';
import { Input } from 'antd';

const defaultProps={
	username:'默认用户名'
};

export default class ComponentBodyIndex extends React.Component{
  constructor(props) {
  	super(props);//调用基类的所有初始化的方法
  	this.state={
  		username:"parry",
  		age: 20
  	};//初始化赋值
  };

  changeUserInfo(age) {
  	this.setState({age:age});
  	console.log(this.refs.submitButton);
  	// this.refs.submitButton.style.color = 'red';
  };

//子页面通过这个方法传参给父页面
  handleChildValueChange(event) {
  	this.setState({
  		age:event.target.value
  	});
  };


  render() {
    return (
	  <div>
		<h2>页面的主体内容</h2>
		<p>接收到的父页面的属性：userid:{this.props.userid};
		username:{this.props.username};
		age:{this.state.age}</p>
		<Input placeholder="Basic usage" />
		<Input id="submitButton" ref="submitButton" type="button" value="提交" onClick={this.changeUserInfo.bind(this, 99)}/>
		<ComponentBodyChild {...this.props} id={4} handleChildValueChange={this.handleChildValueChange.bind(this)}/>
	  </div>
	)
  }

}

//父子属性的正则
ComponentBodyIndex.propTypes={
	userid:React.PropTypes.number.isRequired
};

ComponentBodyIndex.defaultProps=defaultProps;

